<template>
  <el-row>
    <el-col :span="8" style="padding-right;: 10px">
      <div class="grid-content bg-purple">
        <UserCard></UserCard>
        <purChse></purChse>
      </div>
    </el-col>
    <el-col :span="16" style="padding-left: 10px">
      <OrDer></OrDer>
      <ZheXian></ZheXian>
      <div class="picturefooter">
        <ZhuZhuang style="width: 48%; height: 260px"></ZhuZhuang>
        <BingZhuang style="width: 48%; height: 260px"></BingZhuang>
      </div>
    </el-col>
  </el-row>
</template>
<script>
import purChse from '../components/purChse.vue'
import UserCard from '../components/UserCard.vue'
import OrDer from '../components/OrDer.vue'
import ZheXian from '../components/ZheXian.vue'
import ZhuZhuang from '../components/ZhuZhuang.vue'
import BingZhuang from '../components/BingZhuang'
export default {
  components: {
    purChse,
    UserCard,
    OrDer,
    ZheXian,
    BingZhuang,
    ZhuZhuang
  }
}
</script>
<style lang="less" scoped>
.picturefooter {
  margin-top: 20px;
  display: flex;
  justify-content: space-between;
}
</style>
